<template>
	<view class="list">
		<u-list @scrolltolower="scrolltolower">
			<u-list-item v-for="(item, index) in list" :key="item.id"   >
				<view v-if="item.opern" class="item" @click="go('/pages/info/detail?id=' + item.opern_id)">
					<u--image :showLoading="true" :src="item.opern.img" width="200rpx" height="150rpx"></u--image>
					<view class="info">
						<view class="title">
							<u--text :lines="1" :text="item.opern.title"></u--text>
						</view>
						<view class="price">
							<u--text :lines="3" :text="item.opern.content"></u--text>
						</view>
					</view>
				</view>
			</u-list-item>
			<view  v-if="list.length == 0">
				<u-empty mode="data" ></u-empty>
			</view>
		</u-list>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				is_more: 0,
				query: {
					page: 1,
					size: 10
				},
			};
		},
		onLoad() {
			this.getPageFun();
		},
		methods: {
			go(url){
				uni.navigateTo({
					url
				})
			},
			scrolltolower(){
				if (this.is_more) {
					this.getPageFun();
				}
			},
			getPageFun() {
				var _this = this;
				uni.$u.http.post('/User/footprintPage',{...this.query}).then(async res =>{
					let curPageData = res.lists;
					if (this.query.page == 1) {
						_this.list = [];
					}
					if (res.is_more) {
						_this.query.page++;
					}
					_this.is_more = res.is_more;
					_this.list = _this.list.concat(curPageData);
				}).catch(err => {
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
.list{
	padding: 0 30rpx;
	box-sizing: border-box;
	.item{
		margin-top: 30rpx;
		display: flex;
		.info{
			flex: 1;
			margin-left: 30rpx;
			.title{
				font-size: 32rpx;
				font-family: pingfang Sc;
			}
			.price{
				.price-num{
					font-size: 36rpx;
					font-weight: 600;
					color: red;
				}
				.unit{
					font-size: 24rpx;
				}
			}
		}
	}
}
</style>
